<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                template="/templates/mantenimiento.xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.org/ui"
                    
                xmlns:r="http://richfaces.org">
    <ui:define name="isLogin" />
    <ui:define name="title">
        Iniciar sesión
    </ui:define>
    <ui:define name="datos">
        <h:form id="datosform">
            <h:panelGrid id="panelDatos" columnClasses="alignTop,alignTop" cellpadding="20" cellspacing="20" columns="2" >
                <h:panelGroup  style="color: darkslategrey" styleClass="texto14">
                    <h:panelGrid   columnClasses="alignCenter"  columns="1" >
                        <p:graphicImage value="/resources/images/login.jpg" width="150px"   title="Login de usuario"/>
                        <h:outputText style="font-style: italic" value="Ingrese a su cuenta para activar su perfil de usuario. 
                                      Si olvidó su contraseña escriba un mail a david_s_1086@hotmail.com" />
                    </h:panelGrid>

                </h:panelGroup>
                <r:panel styleClass="curved"  >
                    <p:spacer width="120" height="50" />
                    <h:outputText   styleClass="logo22_titulo" value="LOGIN" />
                    <h:panelGrid width="360px"  columns="2" >
                        <h:outputText style="color: darkslategrey" styleClass="texto14" value="Usuario" />
                        <f:verbatim/>
                        <p:inputText id="username"  label="Usuario" value="#{jsfLogin.username}"  required="true"  size="40" title="Nombre de usuario"
                                     >
                            <p:watermark for="username" value="ingrese su usuario" />
                        </p:inputText>

                        <f:verbatim/>
                        <p:message for="username"  />
                        <f:verbatim/>

                        <h:outputText  style="color: darkslategrey" styleClass="texto14" value="Contraseña" />
                        <f:verbatim/>
                        <p:password id="password" label="Constraseña" value="#{jsfLogin.password}" required="true" size="40" title="Clave o contraseña" >
                            <p:watermark for="password" value="ingrese su contraseña" />
                        </p:password>
                        <f:verbatim />
                        <p:message for="password" />
                        <f:verbatim />

                        <p:message for="datosform">
                            <f:facet name="errorMarker">
                                <h:graphicImage library="images/icons" name="warning.jpg" />
                            </f:facet>
                            <f:facet name="infoMarker">
                                <h:graphicImage library="images/icosn" name="passed.gif" />
                            </f:facet>
                        </p:message>
                        <f:verbatim />

                    </h:panelGrid>
                    <h:panelGrid  columns="3">
                        <p:spacer width="230" height="80" />
                        <p:commandButton id="aceptar" value="Iniciar sesión" action="#{jsfLogin.loginAction}" update="panelDatos"  />
                        <r:status id="commonstatus">
                            <f:facet name="start">
                                <h:graphicImage library="images/ajax" name="status2.gif" />
                            </f:facet>
                        </r:status>
                    </h:panelGrid>



                </r:panel>
            </h:panelGrid>
            <p:focus context="panelDatos"/>
        </h:form>
    </ui:define>

</ui:composition>
